import React from 'react';
import './index.less';
import {connect} from 'react-redux';
import {change_task_state} from '../../redux/action/actions';

const CTaskListCon = (props) => {
  let title_arr = [
    'New Task',
    'On Going',
    'Finished',
    'Abandoned'
  ];
  let task_state_arr = [
    'newTask',
    'onGoing',
    'finished',
    'abandoned',
  ];
  let day = props.get_day_task_reducer.task.date; // 当前任务的日期戳
  let task_state1 = task_state_arr[title_arr.indexOf(props.ctitle)]; // 当前任务状态
  let task_index = props._index; // 当前单个任务的下标
  const handleClick = (e) => {
    let task_state2 = e.target.innerHTML; // 修改后的状态
    props.change_task_state(day, task_state1, task_state2, task_index);
  }

  return (
    <div className="task_pop">
      {task_state_arr.map((item, index) => {
        if(index !== title_arr.indexOf(props.ctitle)) {
          return (
            <p key={item} onClick={handleClick}>
              {item}
            </p>
          )
        }
      })}
    </div>
  )
}

// export default CTaskListCon;
export default connect(
  state => state,
  {change_task_state}
)(CTaskListCon);